<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>插入学生</title>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
</head>
<body>
<h1>插入学生</h1>

<input type="button" value="请求后台" id="submitBtn">
<div id="response"></div>

<script>
    $(document).ready(function() {
        var studentData = [];

        // 用户1
        studentData.push({
            id: $("#user1Id").val(),
            name: $("#user1Name").val(),
            age: $("#user1Age").val(),
            classId: $("#user1ClassId").val()
        });

        // 用户2
        studentData.push({
            id: $("#user2Id").val(),
            name: $("#user2Name").val(),
            age: $("#user2Age").val(),
            classId: $("#user2ClassId").val()
        });

        $("#submitBtn").click(function() {
            var jsonStudentData = JSON.stringify(studentData);

            $.ajax({
                type: "POST",
                url: "/student/addStudents",
                contentType: "application/json",
                data: jsonStudentData,
                dataType: "json",
                success: function(data) {
                    $("#response").html("插入成功：" + JSON.stringify(data));
                },
                error: function() {
                    $("#response").html("插入失败");
                }
            });
        });
    });
</script>
</body>
</html>
